<!DOCTYPE html>
<html lang="en">
<head>
    <meta name="layout" content="bocMain"/>
    <title>进件作业系统</title>

</head>

<body>

<header class="header-title">电子签名</header>
<div class="weui-cells__title">签名区域</div>
<div style="padding: 0 15px">
    <div id="signatureArea" style="height:36rem;width: 100%;border: 2px dotted black;background-color: lightgrey;">
    </div>
</div>
<g:form action="signatureSave" method="post" class="myForm">
    <input type="hidden" id="id" name="id" value="${this?.opportunity?.id}">
    <input type="hidden" id="signature" value="" name="signature">

</g:form>

<div class="wx-bm-link-warp">
    <div class="weui-flex">
        <div class="weui-flex__item wx-bm-link" style="margin-right: 6px"  type="reset" id="resetBtn">重置</div>
        <div type="submit" class="weui-flex__item wx-bm-link" id="submitBtn">我签好了</div>
    </div>
</div>
<asset:javascript src="boc/flashcanvas.js"/>
<asset:javascript src="boc/jSignature.min.js"/>
<script type="text/javascript">
    $(function () {
        var $sigdiv = $("#signatureArea");
        var arguments = {
            width: '100%',
            height: '100%',
            color:'#000', "decor-color": "transparent",
            lineWidth: '3'
        };

        $sigdiv.jSignature(arguments);
        $("#resetBtn").click(function () {
            $sigdiv.jSignature("reset");

        });
        $("#submitBtn").click(function () {
            var datapair = $sigdiv.jSignature("getData", "image");
            var img = new Image();
            console.log(datapair[0])
            console.log(datapair[1])
            img.src =  'data:' + datapair[0] + ',' + datapair[1];
            $("#signature").val(datapair[1]);
            $.ajax({
                method: "POST",
                url: "/bocAppOpportunity/anxinqianEvaluateComponent",
                data: {
                    component:"安心签签署合同3206",
                    contractType:"业务申请表",
                    file: $("#signature").val(),
                    opportunityId:$("#id").val()
                },
                success: function (data) {
                    if (data.code == "200")
                    {
                        console.log("签署合同成功");
                        $(".myForm").submit();
                    }
                    else
                    {
                        helpMessage("签署合同失败，请联系管理员");
                        return;
                    }
                },
                error: function (jqXHR) {
                    console.log(JSON.stringify(jqXHR));
                }
            });
        });

        function helpMessage(message) {
            $(".helpMsg").text(message).fadeIn(200);
            setTimeout(function () {
                $(".helpMsg").fadeOut(200);
            }, 2000);
        }
        
    });



    // function jSignatureTest() {
    //     var $sigdiv = $("#signature");
    //     var datapair = $sigdiv.jSignature("getData", "image"); //设置输出的格式，具体可以参考官方文档
    //
    //     var i = new Image();
    //     i.src = "data:" + datapair[0] + "," + datapair[1]
    //     $(i).appendTo($("#image")) // append the image (SVG) to DOM.
    // }
</script>
</body>
</html>
